<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map_canvas { height: 100% }
    </style>
    <script type="text/javascript"
      src="http://maps.googleapis.com/maps/api/js?key=AIzaSyAoAxO9OD56u47EcLdfQgZvcrofzZvYLzg&sensor=false">
    </script>
    <script type="text/javascript">
		var markers = [];
		var map;
		var geocoder;

		function initialize() {
			geocoder = new google.maps.Geocoder();
		
				var myOptions = {
						center:  new google.maps.LatLng(51.508129, -0.128005),
						zoom: 7,
						mapTypeId: google.maps.MapTypeId.ROADMAP
				};

				map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

				makeMarker('Milton Keynes, United Kingdom','Principal Developer at Capita Childrens Services');
				makeMarker('Harrogate, North Yorkshire, United Kingdom','Group IT Solutions Manager at St Ives Plc');
				makeMarker('Bristol, United Kingdom','IT Development Manager at Consumer Intelligence');
				makeMarker('Dudley, United Kingdom','Escrow Technical Manager at NCC Group');
				makeMarker('Worcester, United Kingdom','Technology Executive');
				makeMarker('Wolverhampton, United Kingdom','Geopost UK');
				makeMarker('Telford, United Kingdom','Group Head of IT Development at Secure Trust Bank');
				makeMarker('Leeds, United Kingdom','System Development Manager - Isban UK');
				makeMarker('United Kingdom','CTO at Exel Management Ltd');
				makeMarker('Reading, United Kingdom','Customer Engagement Director at Ixxus Ltd');
				makeMarker('London, United Kingdom','Consumer Systems Development Manager at ASOS.com');

				showOverlays();
		}

		function showOverlays() {
		  if (markers) {
			for (i in markers) {
			  markers[i].setMap(map);
			}
		  }
		}

		function addMarker(location,title) {
		  var marker = new google.maps.Marker({
			position: location,
			map: map,
			title: title
		  });
		  markers.push(marker);
		}

		function makeMarker(address,title) {
				geocoder.geocode( { 'address': address}, function(results, status) {
								if (status == google.maps.GeocoderStatus.OK) {
										addMarker(results[0].geometry.location, title);
								}
						}
				);
		}
    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas" style="width:100%; height:100%"></div>
  </body>
</html>

